<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!--suppress ALL-->
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>个人名片夹</title>
<link href="../../css/style.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="../../js/jquery.js"></script>
<script type="text/javascript">
  function tipOpen(content) {
    $(".tipright p").text();
    $("#tip").fadeIn(200);
  }
  function tipClose() {
    $("#tip").fadeOut(200);
  }
  function allottipOpen() {
    $("#allottip").fadeIn(200);
  }

  function allottipclose() {
    $("#allottip").fadeOut(200);
  }
  $(function () {
    var totalPage = parseInt($('.totalPage').html());
    var pageNum = parseInt($('.pageNum').html());
    function nextPage(totalPage,pageNum) {
      if (pageNum>=totalPage){
        alert("这是最后一页了")
      }else{
        pageNum++;
        window.location='/office/queryContactsListByUser?pageNum='+pageNum;
      }
    }
    function rePage(pageNum) {
      if (pageNum<=1){
        alert("这是已经是第一页了")
      }else{
        pageNum--;
        window.location='/office/queryContactsListByUser?pageNum='+pageNum;
      }
    }
    $('.pagepre').click(function () {
      rePage(pageNum);
    })
    $('.pagenxt').click(function () {
      nextPage(totalPage,pageNum);
    })
  })
</script>
</head>

<body>
<div class="place"> <span>位置：</span>
  <ul class="placeul">
    <li>个人办公</li>
    <li>名片夹</li>
    <li>个人名片夹列表</li>
  </ul>
</div>
<div class="rightinfo">
  <form action="" method="post">
    <ul class="tools">
      <li> 公司名称:
        <input type="text" size="12" />
      </li>
      <li> 客户姓名:
        <input type="text" size="12" />
      </li>
      <li> 所属区域：
        <select>
          <option>请选择省份</option>
          <option>北京</option>
          <option>江苏</option>
          <option>天津</option>
        </select>
        <select>
          <option>请选择城市</option>
          <option>北京</option>
          <option>南京</option>
          <option>天津</option>
        </select>
      </li>
      <li> 状态：
        <select>
          <option>请选择     </option>
          <option value="1">可用</option>
          <option value="0">不可用</option>
        </select>
      </li>
      <li> 是否分配：
        <select>
          <option>请选择     </option>
          <option value="1">已分配</option>
          <option value="0">未分配</option>
        </select>
      </li>
      <li class="subBut" onclick="window.location.href='/office/contactsAdd'"><img src="../../images/t06.png" />查询</li>
      <li class="subBut" onclick="window.location.href='/office/contactsAdd'"><img src="../../images/t01.png" />添加</li>
    </ul>
    <table class="tablelist">
      <thead>
      <tr>
        <th>序号</th>
        <th>id</th>
        <th>姓名</th>
        <th>公司名称</th>
        <th>职位</th>
        <th>邮箱</th>
        <th>手机号</th>
      </tr>
      </thead>
      <tbody>
      <tr th:each="contact:${contactsPageModel.data}">
        <td th:text="${contactStat.index+1}">序号</td>
        <td th:text="${contact.id}">id</td>
        <td th:text="${contact.userName}">姓名</td>
        <td th:text="${contact.companyName}">公司名称</td>
        <td th:text="${contact.job}">职位</td>
        <td th:text="${contact.email}">邮箱</td>
        <td th:text="${contact.tel}">手机号</td>
        <td>
            <a class="tablelink rename">重命名</a>
            <a href="javascript:void(0)" class="tablelink setStatus">公开</a>
            <a href="storageUpdate.html" th:href="@{'/office/removeContactType/'+${contact.id}}" class="tablelink">删除</a>
        </td>
      </tr>
      </tbody>
    </table>
    <div class="pagin">
      <div class="message">共<i class="blue" th:text="${contactsPageModel.totalRows}">1256</i>条记录(<i class="blue totalPage" th:text="${contactsPageModel.totalPage}+1"></i>页)，当前显示第&nbsp;<i class="blue pageNum" th:text="${contactsPageModel.pageNum}">2&nbsp;</i>页</div>
      <ul class="paginList">
        <li class="paginItem"><a href="javascript:;"><span class="pagepre"></span></a></li>
        <li class="paginItem"><a th:text="${contactsPageModel.pageNum}" href="javascript:;">1</a></li>
        <li class="paginItem"><a href="javascript:;"><span class="pagenxt"></span></a></li>
      </ul>
    </div>
  </form>
  <!-- 提示框 -->
  <div id="tip" class="tip">
    <div class="tiptop"><span>提示信息</span><a onclick="tipClose()"></a></div>
    <div class="tipinfo"> <span><img src="../../images/ticon.png" /></span>
      <div class="tipright">
        <p></p>
        <cite>如果是请点击确定按钮 ，否则请点取消。</cite> </div>
    </div>
    <div class="tipbtn">
      <input name="" type="button"  class="sure" value="确定" onclick="tipClose(this)" />
      &nbsp;
      <input name="" type="button"  class="cancel" value="取消" onclick="tipClose(this)" />
    </div>
  </div>
  <!-- 审批提示框 -->
  <div id="allottip" class="tip">
    <div class="tiptop">
    	<span>提示信息</span><a onclick="allottipclose()"></a>
    </div>
    <div class="tipinfo1">
        部门：
            <select class="dfselect" disabled="disabled">
            	<option>请选择</option>
                <option selected="selected">市场部</option>
                <option>采购部</option>
                <option>财务部</option>
            </select>
			<p/>
            职位：
            <select class="dfselect">
            	<option>请选择</option>
                <option>一组组员</option>
                <option>二组组员</option>
                <option>三组组员</option>
            </select>
   			<p/>
            姓名：
            <select class="dfselect">
            	<option>请选择</option>
                <option>刘备</option>
                <option>曹操</option>
            </select>
			<p/>
    </div>
    <div class="tipbtn">
      <input name="" type="button"  class="sure" value="确定" onclick="allottipclose()" />
      &nbsp;
      <input name="" type="button"  class="cancel" value="取消" onclick="allottipclose()" />
    </div>
  </div>
</div>
<script type="text/javascript">
	$('.tablelist tbody tr:odd').addClass('odd');
</script>
</body>
</html>
